Conventional technologies for creating web content allow users to create predefined styles (e.g., fonts, colors, spacing, etc) for formatting one or more web pages. Just as web pages can be formatted using HyperText Mark-up Language (HTML) tags (i.e. <table> to define a table, <P> to define a paragraph, etc), styles can be created to define how each table or paragraph should formatted. For example, placing the <P> tag on a web page indicates the start of a new paragraph. However, defining the <P> tag as “P {text-align:center;color:red}” results in every paragraph defined by <P> being formatted as aligned in the center, and the text displayed in red. There can be different kinds of styling that appear within a document.
In HTML Styling, all styling is performed strictly through the use of HTML tags, such as “<div align=“center”><p><font color=“red”> This is a centered red paragraph</font></p></div>”.
In Inline CSS Styling, the styling for a particular HTML element is performed directly within that element, such as “<p style=“text-align:center;color:red;”> This is a centered red paragraph</p>”.
In Internal CSS Styling, the style is defined at the beginning of the document (within the document's “<head>” section, and all HTML elements can make use of it. This definition appears in the document's<head> section, such as “<style type=“text/css” .red-paragraph {color: red; text-align: center;}</style>”. This HTML element makes use of the style “<p class=“red-paragraph”> This is a centered red paragraph</p>”. The use of the “CSS” acronym can be used to refer to both the styling syntax (“a CSS style”) as well as the Cascading style sheets themselves.
Styles can be defined within the web page in which they are used. Styles can also be defined in a separate style document. The style document is then referenced by any web page that implements any of the styles defined within the style document. The style document is called a style sheet, or, more specifically, a Cascading Style Sheet (CSS), since a single web page can reference multiple style sheets, as well as define styles within the web page itself. The concept that a web page developer can define styles within a web page, and those styles take priority over styles ‘inherited’ from a style sheet referenced by that web page results in the terminology of a “Cascading” Style Sheet.
By creating predefined styles within Cascading Style Sheets, multiple web pages can reference the same style (by referencing the Cascading Style Sheet in which the referenced style is defined), assuring uniformity across all the web pages that use that style. Modifying the style attributes of a collection of web pages can be performed efficiently by simply modifying the style within the Cascading Style Sheet (referenced by each of the web pages within the collection of web pages), where the style is defined. All web pages that use that style (and reference the Cascading Style Sheet that defines that style) will be automatically updated with the modified style. This feature saves web page developers the task of individually updating the web pages each time a modification to a style is made. This feature also reduces errors, since the modified style will either work for all pages or none of the pages, allowing the web page developer to quickly see the error. Individually updating the styles on the web pages could introduce errors on some of the web pages that would be harder to detect, and might go unnoticed. It is for these reasons why Cascading Style Sheets are frequently used by web page developers.